<script type="text/javascript">
	$(document).ready(function() {
		//Lorsque vous cliquez sur un lien de la classe poplight et que le href commence par #
		$('a.poplight[href^=#]').click(function() {
			window.showModalDialog("../../PopupGenererScript/<?php echo $satable['Table']['id'];?>","nom_fenetre","params_fenetre" );

			return false;
		});
		//Lorsque vous cliquez sur un lien de la classe poplight et que le href commence par #
		
		//alert('rleb');
	});
</script>

<script type="text/javascript">
	$(document).ready( function () {

		var table_id='#myDataTable';

		var oTable;
	
		//************************************************************************************
		//GESTION des filtres sur chaque colonnes 
		//************************************************************************************
		// Use the elements to store their own index 
		$("thead input").each( function (i) {
			this.visibleIndex = i;
		} );
		
		$("thead input").keyup( function () {
			//If there is no visible index then we are in the cloned node
			var visIndex = typeof this.visibleIndex == 'undefined' ? 0 : this.visibleIndex;
			
			//Filter on the column (the index) of this element 
			oTable.fnFilter( this.value, visIndex );
		} );
		
		//
		// Support functions to provide a little bit of 'user friendlyness' to the textboxes
		//
		$("thead input").each( function (i) {
			this.initVal = this.value;
		} );
		
		$("thead input").focus( function () {
			if ( this.className == "search_init" )
			{
				this.className = "";
				this.value = "";
			}
		} );
		
		$("thead input").blur( function (i) {
			if ( this.value == "" )
			{
				this.className = "search_init";
				this.value = this.initVal;
			}
		} );
		//************************************************************************************

		$(table_id + " tbody tr").click( function( e ) {
	        if ( $(this).hasClass('row_selected') ) {
	            $(this).removeClass('row_selected');
	        }
	        else {
	            oTable.$('tr.row_selected').removeClass('row_selected');
	            $(this).addClass('row_selected');
	        }
	    });
	     
	    /* Add a click handler for the delete row */
	    $('#delete').click( function() {
	        var anSelected = fnGetSelected( oTable );
	        oTable.fnDeleteRow( anSelected[0] );
	    } );

		oTable = 
        $(table_id).dataTable({
	        "fnRowCallback": function( nRow, aData, iDisplayIndex ) {
	        //Pour chaque colonne de la ligne
				//	si la classe du <th> contient 'editable' 
				//	alors on met la classe editable sur le <td>
	            // for ( var i=0 ; i<$('td', nRow).length ; i++ ){
	            // 	if ($(table_id + ' thead th').eq(i).attr('class').indexOf("editable")>=0 &&
	            // 		!($('td', nRow).eq(i).attr('class').indexOf("editable")>=0)){
	            // 		$('td', nRow).eq(i).attr('class','editable ' + $('td', nRow).eq(i).attr('class'));
	            // 	}
	            // }
	            /* Pour chaque colonne de la ligne on met l'attribut 'nowrap' */
	            $('td', nRow).attr('nowrap','nowrap');
	            //$('td', nRow).attr('onclick','alert(\'rleb\')');
	            return nRow;
	        },
	         fnInitComplete: function() {
	         	//alert($('table tbody tr').eq(0).attr('id'));
				$('table tbody tr').focusin( function() {
			        $(this).toggleClass('row_selected');
			    } );
	         },
		 	//"sScrollXInner": "150%",
		 	//"bScrollCollapse": true,
			fnDrawCallback: function ( oSettings ) {
				//alert('RLEB');
				//$('tr').attr('nowrap','nowrap');
				/* Need to redo the counters if filtered or sorted */
				if ( oSettings.bSorted || oSettings.bFiltered ) {
					for ( var i=0, iLen=oSettings.aiDisplay.length ; i<iLen ; i++ ) {
						var nTr = oSettings.aoData[ oSettings.aiDisplay[i] ].nTr ;
						this.fnUpdate( i, nTr, 0, false, false );
					}
				}
			},
		 	"sScrollY": "400px",
		 	"sScrollX": "100%",
	        //"bJQueryUI": true,
            "bServerSide": true,
	        "bStateSave": false,
	        //"bLengthChange": true,
	        //"bInfo": true,
	        //"bAutoWidth": false,
	        "bDeferRender" : false,
        	"bPaginate": true,
	        //"bFilter" : false,
	        "bProcessing": true,
	        //"bSortClasses" : true,
			//"sDom": 'C<"clear">lfrtip',
		 	//"bScrollInfinite" : true,
		 	"aoColumnDefs": [
				{ "bSortable": false, "sClass": "index", "aTargets": [ 0 ] }
			],
			"aaSorting": [[ 1, 'asc' ]],

			// "aoColumnDefs": [
			// 	{ "bVisible": false, "aTargets": [ 1 ] }
			// ],
	        // "oLanguage": {
	        //     "sSearch": "Search all columns:"
	        // },
            "sPaginationType": "full_numbers",
            "sAjaxSource": "../../ChargerLignes_ajax/<?php echo $satable['Table']['id'];?>"
            //,
			//"fnServerData": fnServerObjectToArray( [ 'id', 'codsoc', 'codtbl', 'cletbl', 'lib1' ] ),
			// "fnServerData": function( sUrl, aoData, fnCallback ) {
   //          	$.ajax( {
	  //               "url": sUrl,
	  //               "data": aaData,
	  //               "success": fnCallback,
	  //               "dataType": "jsonp",
	  //               "cache": false
	  //           } );

   //      	}
   //      	,
   //          "aoColumns":[
   //          	{
   //              	"bVisible" : false
   //             	},
   //              {},
   //              {},
   //              {},
   //              {}
   //          ]
        });
	
	 	// var a = new FixedColumns( oTable, {
	 	// 	"iLeftColumns": 1,
			// "iLeftWidth": 350
	 	// } );
	} );

/* Get the rows which are currently selected */
function fnGetSelected( oTableLocal )
{
    return oTableLocal.$('tr.row_selected');
}
</script>


	<?php echo "<li>".$this->Html->link(__('Editer'),array('controller'=>'dynamiques','action'=>'Editer',$satable['Table']['id']))."</li>"; ?>



<div id="processing_message" style="display:none" title="Processing">Please wait while your request is being processed...</div>


<div class="container-fluid">
  	<div class="row-fluid">

  		<div class="span2">
		  	<div class="well sidebar-nav">
		    	<ul class="nav nav-list">
		      		<li class="nav-header">Sidebar</li>
		      		<?php 
						echo '<li class="">'.$this->Html->link('Applications',array('controller'=>'applications','action'=>'index')).'</li>';
					?>
					<?php 
						echo '<li class="">'.$this->Html->link('--'.h($sonapp['Application']['name']),array('controller'=>'applications','action'=>'View',$sonapp['Application']['id']))."</li>";
					?>
					<?php 
						echo '<li class="">'.$this->Html->link('----'. h($versionencours['Version']['name']),array('controller'=>'versions','action'=>'View',$versionencours['Version']['id']))."</li>";
					?>
					<?php 
						echo '<li class="active">'.$this->Html->link('------'. h($satable['Table']['name']),array('controller'=>'tables','action'=>'View',$satable['Table']['id'], $versionencours['Version']['id']))."</li>";
					?>
					</li>
					<li></br></li>
		    	</ul>
		  	</div><!--/.well -->
		</div><!--/span-->

		<div class="span10">
			<div class="container-fluid">
				<div class="row-fluid">
					<div class="span12">
						<?php echo $this->Session_gpp->flash();
					            //'Message.success');
					            ?>
				 	</div>
				</div>

				<div class="row-fluid">
					<div class="span12">
						<div class="navbar"/>
							<div class="navbar-inner_gpp">
								<div class="container-fluid">
									<div class="nav-collapse">
										<div class="row-fluid">
											<div class="span2">
												<p>
													<button id="btnAddNewRow" class="btn btn-primary btn-small">Add</button>
												</p>
											</div>
											<div class="span2">
												<p>
													<button id="btnDeleteRow" class="btn btn-danger btn-small">Delete</button>
												</p>
											</div>
											<div class="span2">
												<p>
													<?php echo $this->Html->link(__('Annuler'),array('controller'=>'dynamiques','action'=>'DynamiqueOfTable',$satable['Table']['id']), array('class'=>'btn btn-inverse btn-small')); ?>
												</p>
											</div>

											<div class="span2">
												<p>
													<a href="#?w=500" rel="popup_name" class="btn btn-inverse btn-small poplight" >Generer</a>
												</p>
											</div>
											<!--div class="add_delete_toolbar span2" /-->
											<div class="span4">
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>

						<div class="page-header">
							<?php if (isset($colonnes)){ ?>
								<?php //echo $this->Form->create('Dynamique');?>
									<table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered" id="myDataTable">
										<thead>
											<tr>
												<td/>
												<td><input type="text" style="width: 50px"  name="search_engine" value="Search" class="search_init" /></td>
												<?php foreach ($colonnes as $colonne): 
													if (is_numeric($colonne['Colonne']['longueur']) && $colonne['Colonne']['longueur']!=0 ){
														$longueur=$colonne['Colonne']['longueur'];
													}else{
														$longueur=8;
													}
														
													echo '<td><input class="search_init" value="Search" name=search_"'.h($colonne['Colonne']['name']).'" style="width: '.($longueur*10).'px"/></td>';
												endforeach; ?>
											</tr>
											<tr>
												<th/>
												<th width="200" id="id">id</th>
												<?php foreach ($colonnes as $colonne): 
													echo '<th width="200" class="editable" id="'.h($colonne['Colonne']['name']).'" name="'.h($colonne['Colonne']['name']).'" class="editable">
															'.h($colonne['Colonne']['name']).'</th>';
												endforeach; ?>
											</tr>
										</thead>
										<!--tbody id="tbodyLigne"-->
										<!--/tbody-->
									</table>

									<script type="text/javascript" charset="utf-8">
									  	$(function () {
									  		<?php foreach ($colonnes as $colonne): 
												echo "$('#".__($colonne['Colonne']['name'])."_a').popover('hide');";
											endforeach; ?>
										    $('#test').popover('hide');
											$('#test3').tooltip('hide');
										})
									</script>

									<!-- Place holder where add and delete buttons will be generated -->

	
								<?php //echo $this->Form->end(__('Submit'));?>
							<?php }?>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
